<template>
  <base-breadcrumb>
    <template>
      <a-card>
        <div>
          <a-steps progress-dot :current="1" size="small">
            <a-step title="步骤一" description="基本信息填写" />
            <a-step title="步骤二" description="各部门填写资料" />
            <a-step title="步骤三" description="资料汇总" />
            <a-step title="完成" description="上传签字盖章后的资料" />
          </a-steps>
        </div>

        <titleName title="各部门填写资料" class="title-style"></titleName>
        <a-form-model ref="ruleForm" :model="form" :hideRequiredMark="true">
          <a-row :gutter="24">
            <a-col :md="8" :sm="8">
              <a-form-model-item
                label="所属分公司："
                :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
                :wrapperCol="{ lg: { span: 16 }, sm: { span: 16 } }"
              >
                <BaseInput disabled placeholder="请选择" v-model="form.branchComName"></BaseInput>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item
                label="所属项目："
                :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
                :wrapperCol="{ lg: { span: 16 }, sm: { span: 16 } }"
              >
                <BaseInput disabled placeholder="请选择" v-model="form.projectName"></BaseInput>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item
                label="分包商名称："
                :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
                :wrapperCol="{ lg: { span: 16 }, sm: { span: 16 } }"
              >
                <BaseInput disabled placeholder="请选择" v-model="form.subContractorName"></BaseInput>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item
                label="名称："
                prop="name"
                :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
                :wrapperCol="{ lg: { span: 16 }, sm: { span: 16 } }"
              >
                <BaseInput disabled placeholder="请输入名称" v-model="form.name" />
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item
                label="编号"
                :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
                :wrapperCol="{ lg: { span: 16 }, sm: { span: 16 } }"
              >
                <BaseInput disabled placeholder="请输入" v-model="form.number" />
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item
                label="计量月份"
                prop="measureMonth"
                :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
                :wrapperCol="{ lg: { span: 16 }, sm: { span: 16 } }"
              >
                <BaseInput disabled placeholder="请输入" v-model="form.measureMonth" />
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item
                label="施工范围："
                :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
                :wrapperCol="{ lg: { span: 16 }, sm: { span: 17 } }"
              >
                <BaseTextarea
                  disabled
                  style="width:100%"
                  placeholder="请输入"
                  v-model="form.constructionRange"
                />
              </a-form-model-item>
            </a-col>

            <a-col :md="24" :sm="24" v-for="(item,index) of form.fillDepartmentData" :key="index">
              <a-form-model-item
                :label="item.name"
                prop="name"
                :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
                :wrapperCol="{ lg: { span: 16 }, sm: { span: 16 } }"
                class="f-col"
              >
                <BaseTextarea
                  :disabled="!item.isInput"
                  style="width:100%"
                  placeholder="请输入"
                  v-model="item.opinion"
                />
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </a-card>
      <a-row :gutter="24">
        <a-col :offset="18" class="foot-btn page-btn-right-top">
          <a-button type="danger" @click="deleteDraft">删除草稿</a-button>
          <a-button type="primary" @click="submitForm('0')">保存草稿</a-button>
          <a-button type="primary" @click="submitForm('1')">提交</a-button>
          <a-button type="primary" @click="closeForm">关闭</a-button>
        </a-col>
      </a-row>
    </template>
  </base-breadcrumb>
</template>
<script>
import { getStepOneDetail, submitFormStepTwo } from '@/api/businessAffairs/sml'
export default {
    name:'a'+Date.now(),
    data() {
        return {
            form: {},

            id: '',
        }
    },
    mounted() {
        if (this.$route.query.id) {
            this.id = this.$route.query.id
            console.log(this.id)
            this.getStepOneDetail()
        }
    },
    methods: {
        getStepOneDetail() {
            let params = {
                id: this.id,
            }
            getStepOneDetail(params).then((res) => {
                console.log(res)
                this.form = res.data
            })
        },
        changeIssue() {},
        changeDeduction() {},
        changeContact() {},
        // 删除草稿
        deleteDraft() {},
        // 保存草稿
        saveDraft() {},
        // 提交表单
        submitForm(auditStatus) {
            let params = {}
            this.form.fillDepartmentData.forEach((element) => {
                if (element.isInput) {
                    params = element
                }
            })
            params.measureId = this.id
            submitFormStepTwo(params).then((res) => {
                console.log(res)
                if (auditStatus == 0) {
                    this.$message.success('操作成功')
                    this.$router.go(-1)
                } else {
                    this.$message.success('操作成功')

                    this.$router.push({
                        path: '/businessAffairs/subcontractMeasurement/sml',
                    })
                }
            })
        },
        // 关闭表单
        closeForm() {
            this.$router.go(-1)
        },
    },
}
</script>
<style lang="less" >
.step-text {
    .ant-steps-item-title {
        width: 168px;
    }
}
.check-box {
    .ant-checkbox-group {
        margin-top: 1.5%;
        display: flex;
        justify-content: space-between;
    }
    .ant-checkbox-group-item {
        position: static !important;
    }
}
.radio-box {
    .ant-radio-wrapper {
        position: static !important;
    }
    .ant-radio-group {
        margin-top: 3% !important;
        display: flex;
    }
}
// .ant-form-item-children{
//  .ant-input {
//     width: 100%;
// }
// }

.f-col {
    display: flex;
    margin-left: 34px;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    .ant-form-item-label {
        text-align: left;
    }
}
.foot-btn {
    display: flex;
    justify-content: space-between;
}
</style>